import { Module } from 'vuex'
import { RootState } from '../index'
import { INavigation } from '@/type'

export interface globalState {
  expansion: boolean
  navigationList: Array<INavigation>
  systemColor: string
  systemStyle: string
}

export const global: Module<globalState, RootState> = {
  namespaced: true,
  state: {
    expansion: false, // 控制侧边栏的展开与收缩
    navigationList: [], // 快捷导航数据  [{ title: '首页', path: '/home' }]
    systemColor: '#053b5f', // 整个系统的主题色(默认为element的主题色，可自行修改默认值)
    systemStyle: '--el-color-primary:#053b5f;' // 整个系统的主题样式
  },
  mutations: {
    // 控制侧边栏的展开与收缩
    SET_EXPANSION(state: globalState, boo: boolean) {
      state.expansion = boo
    },
    // 添加快捷导航
    SET_NAVIGATIONLIST(state: globalState, obj: INavigation) {
      if (state.navigationList.some(v => v.path === obj.path)) return
      state.navigationList.push(obj)
    },
    // 移除快捷导航(某一项)
    REMOVE_NAVIGATIONLIST(state: globalState, str: string) {
      const index = state.navigationList.findIndex(v => v.path === str)
      state.navigationList.splice(index, 1)
    },
    // 移除快捷导航(所有)
    REMOVE_NAVIGATIONLIST_ALL(state: globalState) {
      state.navigationList = []
    },
    // 设置主题色
    SET_SYSTEMCOLOR(state: globalState, str: string) {
      state.systemColor = str
    },
    // 设置主题样式
    SET_SYSTEMSTYLE(state: globalState, str: string) {
      state.systemStyle = str
    }
  }
}
